<!DOCTYPE html>
<body>
<script>
    var imgLoad = function() {
        window.pic.removeChild(window.image);
        window.parent.postMessage("shrink", "*");
    }

    var test = function () {
        var entries = performance.getEntriesByType("resource");
        var downloadedImages = 0;
        for (var i = 0; i < entries.length; ++i) {
            var entry = entries[i];
            if (entry.name.indexOf("base-image") != -1)
                ++downloadedImages;
        }
        return downloadedImages;
    }

    window.addEventListener("message", function(msg) {
        if (msg.data == "test")
            window.parent.postMessage("test_" + test(), "*");
    });
</script>
<picture id=pic>
    <source srcset="base-image1.png" media="(max-width: 200px)">
    <img id=image src="base-image2.png" onload="imgLoad()">
<picture>
</body>
